<template>
	<!-- 延期原因  -->
	<view class="flex-col page">
		<view class="flex-col group_1" v-if="this.list!=''">
			<view class="" v-for="(item,i) in list" :key="i">
				<view class="flex-col section_2">
					<view class="flex-col">
						<view class="flex-row group_3">
							<image :src="item.inspectionUrl" class="image_1" />
							<text class="text_1">{{item.inspectionName}}</text>
						</view>
						<view class="justify-between group_4">
							<text class="text_3">延期工种</text>
							<text class="text_5">{{item.temporaryConstructionName}}工作日</text>
						</view>
					</view>
					<view class="justify-between group_5">
						<text class="text_7">延期工时</text>
						<text class="text_9">{{item.temporaryConstructionTime}}</text>
					</view>
					<view class="flex-col items-start group_6">
						<text class="text_11">延期原因</text>
						<text class="text_13">{{item.remarks}}</text>
					</view>
				</view>
				<view v-if="roleId=='104'">
					<view v-if="item.foremanReply==null">
						<view class="justify-between section_4" >
							<text class="text_25">工长回复：</text>
							<text class="text_26" @click="delay(item.temporaryConstructionId)">
								回复
							</text>
						</view>
						
					</view>
					<view class="flex-col section_3" v-else>
						<view class="justify-between" >
							<text class="text_15">工长回复：</text>
							<text class="text_16"  @click="del(i)">删除</text>
						</view>
						<text class="text_17">{{item.foremanReply}}</text>
					</view>
				</view>
				
			</view>
		</view>
		<view v-else>
			<u-empty style="height: 100vh;" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
			</u-empty>
		</view>
	</view>
</template>

<script>
	
	export default {
		components: {},
		data() {
			return {
				list: [],
				constructionPlanId: '',
				roleId:''
			};
		},
		onLoad(option) {
			console.log(option)
			this.constructionPlanId = option.constructionPlanId;
			this.getid()
		},
		created() {
			
			uni.startPullDownRefresh();
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
			
			this.delayBe();
		},
		methods: {
			getid(){
				this.$http('common.getInfo').then(res=>{
					if(res.code==200){
						this.roleId = res.data.roleId;
						console.log(this.roleId,'this.roleId')
					}else{
						uni.showToast({
							icon:"error",
							title:'获取身份失败'
						})
					}
				})
			},
			onPullDownRefresh() {
				setTimeout(function() {
					uni.stopPullDownRefresh();
				}, 1000);
				this.delayBe()
			},
			delay(item){
				// 判断身份
				this.$http('common.getInfo').then(res=>{
					if(res.code==200){
						this.roleId = res.data.roleId;
						if(this.roleId == '105'){
							uni.showToast({
								icon:"error",
								title:'巡检员不可回复信息'
							})
						}else{
							uni.navigateTo({
								url: '/pages/foreman/Qreply/Qreply?id=' + item
							})
						}
					}else{
						uni.showToast({
							icon:"error",
							title:'获取身份失败'
						})
					}
				})
				
				
			},

		del(i){
				// console.log(i)
				// 删除
				this.$http('harryroom.deleteForemanreply',{
					temporaryConstructionId:this.list[i].temporaryConstructionId
				}).then(res=>{
					if(res.code ==200){
						uni.showToast({
							icon: 'none',
							title: '删除成功'
						})
						// this.list[i].foremanReply=null;
						location.reload();
					}else{
						uni.showToast({
							title: res.msg,
							icon: "error"
						})
					}
				})
			},
			delayBe() {
				this.$http('common.delayBe', {
					constructionPlanId: this.constructionPlanId
				}).then(res => {
					console.log(res, 'delayBe')
					if (res.code == 200) {
						this.getid();
						this.list = res.data;
						
					}
				}).catch(err => {

				});
			}
		},
	};
</script>

<style scoped lang="css">
	.section_2 {
		padding: 32rpx 22rpx 41rpx 24rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
		margin-top: 20rpx;
	}

	.group_3 {
		padding-bottom: 24rpx;
		border-bottom: solid 1rpx #eeeeee;
	}

	.group_4 {
		padding-top: 22rpx;
	}

	.image_1 {
		border-radius: 50%;
		width: 64rpx;
		height: 64rpx;
	}

	.text_7 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_9 {
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_11 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_3 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_5 {
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.group_5 {
		margin-top: 39rpx;
	}

	.group_6 {
		margin-top: 39rpx;
	}

	.text_13 {
		margin-top: 31rpx;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_1 {
		margin-left: 16rpx;
		margin-top: 10rpx;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.page {
		background-color: #f6f7f9ff;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100%;
	}

	.group_1 {
		padding: 15rpx 24rpx 62rpx;
		flex: 1 1 auto;
		overflow-y: auto;
	}

	.section_3 {
		margin-top: 20rpx;
		padding: 30rpx 23rpx 41rpx 24rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
		margin-bottom: 20rpx;
	}

	.view_5 {
		margin-top: 20rpx;
	}

	.section_4 {
		margin-top: 20rpx;
		padding: 30rpx 22rpx 41rpx 24rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
	}

	.text_17 {
		margin-top: 31rpx;
		align-self: flex-start;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_25 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_26 {
		color: #1d6aff;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_15 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_16 {
		margin-top: 3rpx;
		color: #ff371d;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}
</style>
